<template>
  <el-dialog :title="title" :close-on-click-modal="false" :visible.sync="visible" width="800px" append-to-body :before-close="handleClose">
    <trouble-shooting-detail :form="form" :dataStatus="dataStatus" :operating="true"></trouble-shooting-detail>
    <el-form ref="form" :model="form" :rules="rules" label-width="100px" size="mini">
      <div class="form-title">审核信息</div>
      <el-row>
        <el-col :span="12">
          <el-form-item label="审核人" prop="auditUserId">
            {{form.auditUserName + "（工区主任）"}}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="审核结果" prop="dataStatus">
            <el-radio-group v-model="form.dataStatus">
              <el-radio label="3">同意</el-radio>
              <el-radio label="4">驳回</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="审核意见" prop="auditMessage">
            <el-input type="textarea" v-model="form.auditMessage" placeholder="请输入审核意见" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">保 存</el-button>
      <el-button @click="cancel">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import {
  getTroubleShooting,
  updateTroubleShooting,
} from "@/api/cases/troubleShooting";
import DeptUserSelect from '@/components/Select/DeptUserSelect.vue';
import { mapGetters } from 'vuex';
import TroubleShootingDetail from '@/components/Detail/troubleShootingDetail.vue';

export default {
  name: "troubleShooting",
  components: { DeptUserSelect, TroubleShootingDetail },
  data() {
    return {
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      visible: false,
      // 表单参数
      form: {
      },
      dataStatus: void 0
    }
  },
  props: {
  },
  computed:{
    ...mapGetters(["userId"]),
    // 表单校验
    rules() {
      return {
        dataStatus: [
          { required: true, message: "审核结果不能为空", trigger: "change" },
        ],
        auditMessage: [
          { required: true, message: "审核意见不能为空", trigger: "blur" },
        ],
        // assignorUserId: [
        //   { required: true, message: "指派人不能为空", trigger: "change" },
        // ],
      }
    },
  },
  methods: {
    /**
     * 打开
     */
    open(id) {
      getTroubleShooting(id).then((response) => {
        this.form = response.data;
        this.dataStatus = this.form.dataStatus;
        this.form.dataStatus = "3"
        this.visible = true;
        this.title = "审核";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          updateTroubleShooting(this.form).then(({ code, data, msg }) => {
            if (code == 200) {
              this.$modal.msgSuccess("审核完成");
              this.handleClose();
              this.$root.$emit("updateTable");
              this.$emit("updateTable");
            } else {
              this.$modal.msgError(msg);
            }
          });
        }
      });
    },
    /**
     * 处理关闭
     */
    handleClose() {
      this.cancel();
    },
    /**
     * 隐藏
     */
    cancel() {
      this.visible = false;
    },
  }
}
</script>

<style>
</style>